﻿body {
    background-color: var(--backgroundColorBodyIndexView);
}

#visionweb-nav {
    background-color: var(--backgroundColorNavbarIndexView);
}

#footer {
    background-color: var(--backgroundColorFooterIndexView);
}

.introduction__container--two {
    max-width: 600px;
    padding:0;
}

.introduction__title {
    font-size: 30px;
    color: #BF211B;
    text-align: center;
    font-weight: bold;
    letter-spacing: 0;
    margin-bottom: 0;
}

.introduction__subtitle--l1 {
    font-weight: bold;
    text-align: center;
}

.introduction__subtitle--l2 {
    color: #BF211B;
    font-weight: bold;
    letter-spacing: 0;
    margin-bottom: 0;
}

.introduction__p--l1,
.introduction__p--l2,
.introduction__p--l3,
.introduction__p--l4 {
    letter-spacing: 0;
    margin-bottom: 0;
}

#introduction, #form {
    margin-top: 30px;
}

.form__container {
    padding: 30px;
    max-width: 600px;
    border-radius: var(--borderRadiusContent1IndexFormulario) !important;
    box-shadow: var(--boxShadowContent1IndexFormulario);
    border: var(--borderContent1IndexFormulario);
    background-color: var(--backgroundContent1);
}

.form__title {
    font-size: var(--fontSizeSubtitleContent1);
    font-family: var(--fontFamilySubtitleContent1);
    color: var(--colorSubtitleContent1);
    font-weight: var(--fontWeightTitleContent1);
    text-align: center;
}

#datauser {
    text-align: center;
}

.form__input-required {
    display: flex;
}

#datauser > input {
    height: 40px;
    padding: 5px 10px;
    font-size: var(--fontSizeTexbox);
    line-height: 1.5;
    border-radius: var(--borderRadiusTexboxIndexFormulario);
    border: var(--borderTexboxIndexFormulario);
    background-color: var(--backgroundColorTexbox);
    margin-bottom: var(--marginBottomTextboxIndexFormulario);
    box-shadow: none;
}

#datauser > select.form-control {
    height: 40px;
    padding: 5px 10px;
    font-size: var(--fontSizeTexbox);
    line-height: 1.5;
    border-radius: var(--borderRadiusTexboxIndexFormulario);
    border: var(--borderTexboxIndexFormulario);
    background-color: var(--backgroundColorTexbox);
    margin-bottom: var(--marginBottomTextboxIndexFormulario);
    box-shadow: none;
}

#datauser > textarea {
    padding: 5px 10px;
    font-size: var(--fontSizeTexbox);
    line-height: 1.5;
    border-radius: var(--borderRadiusTexboxIndexFormulario);
    border: var(--borderTexboxIndexFormulario);
    background-color: var(--backgroundColorTexbox);
    margin-bottom: var(--marginBottomTextboxIndexFormulario);
    box-shadow: none;
    height: 150px;
}

#datauser::placeholder {
    color: #8D8D8E;
}

#datauser > input:focus,
#datauser > textarea,
#datauser > select.form-control,
#datauser > .form__input-required > input:focus,
#datauser > .form__input-required > select.form-control,
#datauser > .form__input-required > textarea {
    outline: none;
    box-shadow: none
}

.form__input-required--mark {
    margin-bottom: 0;
    background-color: var(--backgroundColorTexbox);
    border-bottom-right-radius: var(--borderRadiusTexboxIndexFormulario);
    border-top-right-radius: var(--borderRadiusTexboxIndexFormulario);
    color: #bf211b;
    font-size: 20px;
    display: flex;
    height: 40px;
    align-items: center;
    width: 25px;
    justify-content: center;
}

.form__textarea-required--mark {
    margin-bottom: 5px;
    background-color: var(--backgroundColorTexbox);
    border-bottom-right-radius: var(--borderRadiusTexboxIndexFormulario);
    border-top-right-radius: var(--borderRadiusTexboxIndexFormulario);
    color: #bf211b;
    font-size: 20px;
    display: flex;
    align-items: center;
    width: 25px;
    justify-content: center;
}

#datauser > .form__input-required > input {
    height: 40px;
    padding: 5px 10px;
    font-size: var(--fontSizeTexbox);
    line-height: 1.5;
    border-top-left-radius: var(--borderRadiusTexboxIndexFormulario);
    border-bottom-left-radius: var(--borderRadiusTexboxIndexFormulario);
    border: var(--borderTexboxIndexFormulario);
    background-color: var(--backgroundColorTexbox);
    margin-bottom: var(--marginBottomTextboxIndexFormulario);
    box-shadow: none;
}

#datauser > .form__input-required > select.form-control {
    height: 40px;
    padding: 5px 10px;
    font-size: var(--fontSizeTexbox);
    line-height: 1.5;
    border-top-left-radius: var(--borderRadiusTexboxIndexFormulario);
    border-bottom-left-radius: var(--borderRadiusTexboxIndexFormulario);
    border: var(--borderTexboxIndexFormulario);
    background-color: var(--backgroundColorTexbox);
    margin-bottom: var(--marginBottomTextboxIndexFormulario);
    box-shadow: none;
}

#datauser > .form__input-required > textarea {
    padding: 5px 10px;
    font-size: var(--fontSizeTexbox);
    line-height: 1.5;
    border-top-left-radius: var(--borderRadiusTexboxIndexFormulario);
    border-bottom-left-radius: var(--borderRadiusTexboxIndexFormulario);
    border: var(--borderTexboxIndexFormulario);
    background-color: var(--backgroundColorTexbox);
    margin-bottom: var(--marginBottomTextboxIndexFormulario);
    box-shadow: none;
    height: 150px;
}

.form__check--label {
    text-align: justify;
}

.form__check--label-text {
    color: #000000;
    letter-spacing: 0px;
    margin-bottom: 0;
}

.form-check {
    margin: 25px 0;
}

.form__card--terms-conditions {
    font-size: var(--fontSizeDataPolicyContent1);
    font-family: var(--fontFamilyDataPolicyContent1);
    color: var(--colorDataPolicyContent1);
    font-style: italic;
    text-align: justify;
    border: none;
}

#myCarousel {
    margin: 25px 0;
    text-align: center;
    padding: 10px 0;
    font-weight: bold;
    background-color: var(--backgroundContent3);
    border-radius: var(--borderRadiusPasaMensajesInferiorIndex);
    border: var(--borderPasaMensajesInferiorIndex);
    color: var(--colorContent3);
    font-size: var(--fontSizeContent3);
    box-shadow: var(--boxShadowContent3);
}

.message-alert {
    height: 315px;
    background-color: var(--backgroundColorBootstrapMessageSlider);
    color: var(--colorBootstrapMessageSlider);
    border-color: var(--borderColorBootstrapMessageSlider);
}

.first-toast-turn-request {
    background-color: var(--backgroundColorFirstToastTurnRequest);
    color: var(--colorFirstToastTurnRequest);
    font-family: var(--fontFamilyFirstToastTurnRequest);
}

.second-toast-turn-request {
    background-color: var(--backgroundColorSecondToastTurnRequest);
    color: var(--colorSecondToastTurnRequest);
    font-family: var(--fontFamilySecondToastTurnRequest);
}

.third-toast-turn-request {
    background-color: var(--backgroundColorThirdSecondToastTurnRequest);
    color: var(--colorThirdToastTurnRequest);
    font-family: var(--fontFamilyThirdToastTurnRequest);
}

@media screen and (max-width: 1000px) {
    #form {
        margin-top: 0;
    }
}

@media screen and (min-height: 1269px) {
    #footer {
        position: absolute;
        width: 100%;
        bottom: 0;
    }
}


